<template>
	<view class="page-mode" style="margin-bottom: 20rpx;">
		<view class="mode-title">
			<text>重大关系人人行征信</text>
			<view v-if="showBtn">
				<u-button type="primary" shape="circle" size="mini" :plain="true" icon="plus"
					@click="$helper.onJump(`/pagesJiushi/customer/creditDebt/partyCredit/partyCredit?cid=${customerId}`)">
					<u-icon name="plus" size="24"></u-icon>新增</u-button>
			</view>
		</view>
		<u-gap height="1" bg-color="#f0f2f6"></u-gap>
		<view class="mode-content">
			<view v-if="dataList.length>0">
				<u-swipe-action :show="item.show" :index="index" v-for="(item, index) in dataList" :key="index"
					@click="click" @open="open" :options="options" style="margin-bottom: 2rpx;">
					<view class="block-item">
						<view class="block-content">
							<view class="u-flex u-row-between">
								<text>{{item.majorRelationPerson}}</text>
							</view>
							<view class="u-flex u-row-between">
								<view><label>信用卡总额：</label><text>{{item.creditCardTotal}}元</text>
								</view>
								<view><label>信用卡使用额：</label><text>{{item.creditCardUsageAmount}}元</text>
								</view>
							</view>
							<view class="u-flex u-row-between">
								<view><label>贷款金融机构数：</label><text>{{item.loanFinancialInstitutionsCount}}家</text>
								</view>
								<view>
									<label>信用卡金融机构数：</label><text>{{item.creditCardFinancialInstitutionsCount}}家</text>
								</view>
							</view>
							<view class="u-flex u-row-between">
								<view><label>半年内贷款查询：</label><text>{{item.loanInquiryCountInHalfYear}}次</text></view>
								<view><label>半年内信用卡查询：</label><text>{{item.creditCardInquiryCountInHalfYear}}次</text>
								</view>
							</view>
							<view class="u-flex u-row-between">
								<view><label>两年内逾期次数：</label><text>{{item.overdueCountInTwoYears}}次</text></view>
								<view><label>五年内逾期次数：</label><text>{{item.overdueCountInFiveYears}}次</text></view>
							</view>
							<view>
								<label>M2及以上的信息</label>
								<view>{{item.m2AndAboveInformation}}</view>
							</view>
						</view>
						<JSGJImages :imagesList="item.attachmentList"></JSGJImages>
					</view>
				</u-swipe-action>
			</view>
			<view v-else class="no-data-text">
				<view class="explain uni-center">
					暂无重大关系人人行征信
				</view>
			</view>
		</view>
		<files-list :customerId="customerId" title="重大关系人人行征信附件" type="guanxirenzhengxin"></files-list>
	</view>
</template>

<script>
	import config from '@/common/js/config.js';
	import filesList from '@/pagesJiushi/customer/actualController/components/filesList.vue'
	export default {
		components: {
			filesList
		},
		name: 'partyCredit',
		props: {
			customerId: {
				type: [Number, String],
				default () {
					return ''
				}
			}
		},
		created() {
			this.showBtn = uni.getStorageSync(config.Global.cache + '_ShowCompanyButton')
			if (!this.showBtn) {
				this.options = []
			}
		},
		data() {
			return {
				showBtn: false,
				dataList: [],
				show: false,
				options: [{
						text: "编辑",
						style: {
							backgroundColor: "#007aff",
						},
					},
					{
						text: "删除",
						style: {
							backgroundColor: "#dd524d",
						},
					},
				],
			};
		},
		watch: {
			customerId: {
				immediate: true,
				deep: true,
				handler(val) {
					this.getFormData()
				}
			}
		},
		methods: {
			click(index, index1) {
				if (index1 == 1) {
					let tempData = this.dataList[index]
					this.$helper.ajax({
						url: "/api/Jiushi/Customermajorcredit/" + tempData.id,
						method: "DELETE",
						contentType: "application/json",
						success: res => {
							this.dataList.splice(index, 1);
						}
					});
				} else {
					this.dataList[index].show = false;
					let tempData = this.dataList[index]
					this.$helper.onJump(`/pagesJiushi/customer/creditDebt/partyCredit/partyCredit?id=${tempData.id}`)
				}
			},
			// 如果打开一个的时候，不需要关闭其他，则无需实现本方法
			open(index) {
				// 先将正在被操作的swipeAction标记为打开状态，否则由于props的特性限制，
				// 原本为'false'，再次设置为'false'会无效
				this.dataList[index].show = true;
				this.dataList.map((val, idx) => {
					if (index != idx) this.dataList[idx].show = false;
				});
			},
			getFormData() {
				this.$helper.ajax({
					url: "/api/Jiushi/Customermajorcredit?customerId=" + this.customerId,
					method: "GET",
					contentType: "application/json",
					success: res => {
						if (res.data.data) {
							this.dataList = res.data.data.list.map(item => {
								item.show = false
								item.attachmentList = item.attachment == null || item.attachment ==
									'' ? [] : item
									.attachment.split(',')
								return item
							})
						}
					}
				});
			},
		},
	}
</script>
<style lang="scss" scoped>
	.block-content {
		label {
			color: #999;
		}
	}
</style>